
//window.onerror=function(evt){console.log(evt)}
console.log('loading DCM data, please wait, these are big files, it may take a while ...');
//document.body.innerHTML='<span style="color:red;font-family:verdana">loading DCM data, please wait, these are big files, it may take a while ...</span>';

dcm={
	
	im:[], // this is where the images are going to be loaded, at the end of this
	
	
	
	UI:{
		
		cv:[], // for the canvas elements
		
		start:function(){ // starts UI
			var ht='';
			ht+='<div id="dcm">';
			ht+='<div id="tabs">';
			ht+='<ul><li><a href="#tabs-1">File</a></li><li><a href="#tabs-2">Modules</a></li><li><a href="#tabs-3">More</a></li></ul>';
			ht+='<div id="tabs-1"><button>Load</button> <button>Save</button> <button>About</button></div>';
			ht+='<div id="tabs-2">dois</div>';
			ht+='<div id="tabs-3">tres</div>';
			ht+='</div>';
			ht+='<div id="msg"><span style="color:red;font-family:verdana">loading and processing DCM data, please wait, this may take a while ...</span></div><hr>';
			ht+='<div id="dcmWork" style="font-family:verdana"></div>'
			ht+='</div>';
			$(document.body).html(ht);
			jQuery(function() {$("#tabs").tabs()});
			
			jmat.load('dcmData.js',function(){$('#msg').html('<span style="color:green;font-family:verdana">... DCM data ready.</span>');console.log('... DCM data loaded.');dcm.UI.plot()})
		},
		
		plot:function(){
			$('<div id="slider"></div>').appendTo($('#dcmWork'));
			console.log('Assembling DICOM images');
			this.msg('<span style="color:red">Assembling DICOM images</span>');
			var s = jmat.size(dcm.im);
			// slider
			$('<div id="slider">&nbsp;</div>').appendTo($('#dcmWork'));
			$('#slider').slider({ max: s[0]-1});
			
			//$( ".selector" ).slider({
			//   change: function(event, ui) { ... }
			//});
			
			$('#slider').width(s[2]);
			//plot
			$('<div id="dcmPlot"></div>').appendTo($('#dcmWork'));
			var pos = $('#dcmPlot');
			var M=jmat.max(jmat.max(jmat.max(dcm.im)));
			dcm.im.map(function(imi,i){
				dcm.UI.cv[i]=document.createElement('canvas');
				dcm.UI.cv[i].width=s[1];
				dcm.UI.cv[i].height=s[2];
				dcm.UI.cv[i].id='dcm_'+i;
				//jmat.imagesc(this.cv[i],dcm.im[i],jmat.colormap(),'function(x){return Math.min(1,5*x/M)}');
				jmat.imagesc(dcm.UI.cv[i],imi,undefined,undefined,M);
			})
			for(var i=0;i<s[0];i++){
				$('#dcmPlot').append(dcm.UI.cv[i]);
				dcm.UI.cv[i].style.position='absolute';
				dcm.UI.cv[i].style.left=pos.left;this.cv[i].style.top=pos.top;
			}
			
			this.msg('<span style="color:green">DICOM image assembly complete.</span>');
			$('#slider').slider({ change: function(){dcm.UI.showCv()}});
			dcm.UI.showCv();
			
			
		},
		
		showCv:function(evt,ui){
			var i=$('#slider').slider('value');
			this.cv[i].style.visibility='visible';
			for (var j=0;j<this.cv.length;j++){
				if (j!==i){this.cv[j].style.visibility='hidden';}
			}
		},
		
		msg:function(x){$('#msg').html(x)}
	},
	
	
	
}


dcm.UI.start();

